.lunar-detail{
  background: white;
  margin-top:50px;
  padding:20px 10px;
  box-shadow: 0 0 2px 0 rgba(0,0,0,.06),0 1px 4px 0 rgba(0,0,0,.12);
  .main-title{
    font-size: 30px;
    color:#EDA03F ;
    margin-top:10px;
    padding-left:30px;
  }
  .lunar-step{
    font-size: 18px;
    padding:10px;
    border-bottom: 1px dashed gainsboro;
    &:last-child{
      border:none;
    }
    .col-xs-2{
      text-align: right;
      svg{
        position: relative;
        top:8px;
        right: 7px;
      }
      color: #E76A4F;
    }
    .col-xs-10{
      line-height: 53px;
    }
  }
  input[type='checkbox']{
    display: none;
  }
  .lunar-time-step{
    font-size: 18px;
    label{
      display: block;
      color:#E76A4F ;
      border-bottom: 1px solid gainsboro;
      padding: 10px 0;
      svg{
        position: relative;
        top:8px;
        right: 7px;
      }
    }
    .steps{
      padding:5px 0;
    }
    input[type='checkbox']:checked{
      ~.steps-container{
        display: block!important;

      }
      +label{
        .down-svg-lunar{
          transform:rotate(-180deg);
          position: relative;
          right: 16px;
        }
      }
    }
    .down-svg-lunar{
      float: right;
    }
    .steps-container{
      display: none;
    }
  }
}
